<template>
  <a-modal
    :visible="visible"
    @cancel="clearLayer"
    :keyboard="false"
    :footer="null"
    title="修改手机号/密码"
  >
    <div>
      <QrcodeVue
        :value="Url"
        :size="150"
        class="code"
        style="margin: 10px auto"
      />
    </div>

    <div style="text-align: center">请使用微信扫码修改</div>
    <!-- 修改手机号 -->
    <!-- <modify :visible="visibleBtn" @close="closeLayer" :phoneNumer="phone" /> -->
  </a-modal>
</template>

<script>
import { defineComponent, ref, watch } from "vue";
import QrcodeVue from "qrcode.vue";

export default defineComponent({
  components: { QrcodeVue },
  name: "",
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    // phone: {
    //   type: [Number, String],
    // },
    myUrl: {
      type: String,
    },
  },
  setup(props, context) {
    const clearLayer = () => {
      context.emit("close");
    };
    // const handleOk = () => {
    //   console.log("111");
    //   clearLayer();
    // };

    // const verificationValue = ref();

    // const phoneNumber = computed(() => {
    //   return props.phone;
    // });

    // const again = ref(59);

    // const obtain = () => {
    //   const time = setInterval(() => {
    //     again.value--;
    //     if (again.value === 0) {
    //       clearInterval(time);
    //       again.value = 60;
    //     }
    //   }, 1000);
    //   request.post("/message", "/sms/sendSmsCode").then((res) => {
    //     console.log(res);
    //   });
    // };

    // const myUrl=ref('')
    // const urlHttp=()=>{
    //     request.get("/org", "/user/getInfo").then((res) => {
    //         console.log(res.url.myUrl);
    //         myUrl.value=res.url.myUrl
    //     })
    // }
    // urlHttp()
    // 修改手机号
    // const visibleBtn = ref(false);
    // const closeLayer = () => {
    //   visibleBtn.value = false;
    // };
    // const phone = ref();
    // const nextStep = () => {
    //   // visibleBtn.value = true;
    //   // phone.value = props.phone;
    //   clearLayer();
    // };

    const Url = ref("");

    watch(
      () => props.visible,
      (val) => {
        if (val) {
          Url.value = props.myUrl;
          // const time = setInterval(() => {
          //   again.value--;
          //   if (again.value == 0) {
          //     clearInterval(time);
          //     again.value = 60;
          //   }
          // }, 1000);
        }
      }
    );

    return {
      Url,
      // handleOk,
      clearLayer,
      // obtain,
      // nextStep,
      // verificationValue,
      // again,
      // phoneNumber,
      // visibleBtn,
      // closeLayer,
    };
  },
});
</script>

<style lang="less" scoped>
.verification {
  font-size: 20px;
  font-weight: 600;
  color: black;
  margin-top: 20px;
}
</style>
